import {connect} from 'react-redux'
import React, {Component} from 'react'
import { List } from 'antd-mobile';
const Item = List.Item;
const Brief = Item.Brief;

import Header from "../components/header";

import FooterMenu from "../components/footerMenu";

export default class Find extends Component {
  constructor (props){
   super(props)
   this.state= {

    }
  }
    baseInfo(){
        return [
            {
                title: '活动中心',
                imgsrc: '/static/images/ICON_53.png',
                link: '/activitycenter',
                desc:'彩票活动进行中'
            },   {
                title: '新闻',
                imgsrc: '/static/images/ICON_54.png',
                link: '/news',
                desc:'彩票动态实时查看'
            },   {
                title: '玩法介绍',
                imgsrc: '/static/images/ICON_55.png',
                link: '/play',
                desc:'各种彩票玩法详解解说'
            },
            //    {
            //     title: '走势图',
            //     imgsrc: '/static/images/ICON_41.png',
            //     link: '/awarditem',
            //     desc:'每期开奖号码记录'
            // },
            //    {
            //     title: '聊天室',
            //     imgsrc: '/static/images/ICON_56.png',
            //     link: '/find',
            //     desc:'交流心得'
            // },
        ]
    }

   render() {
      return <div>
          <Header title="发现" isIndex={true}></Header>
             
          <div className="container">
            <List className="my-find">
            {this.baseInfo().map((ListItem, index) => {
                return  <Item key={index}
                arrow="horizontal"
                thumb={ListItem.imgsrc}
                multipleLine
                onClick={() => {
                    this.props.history.push(ListItem.link)
                }}
            >
                
               {ListItem.title}<Brief>{ListItem.desc}</Brief>
            </Item>
            })}
            
            </List>
            </div>

          <FooterMenu></FooterMenu>
      </div>
   } 
}




// function mapStateToProps(state) {
//   return {
//     Index: state.index // gives our component access to state through props.toDoApp
//   }
// }

// export default connect(mapStateToProps)(Index)